
<template>
  <div class="addcoupon-container">
    <breadcrumb style></breadcrumb>
    <div class="content">
      <el-main>
        <el-form ref="form" :model="form">
          <el-form-item label="优惠券名称：" label-width="120px">
            <el-input v-model="form.name"></el-input>
          </el-form-item>
          <el-form-item label="优惠券面额：" label-width="120px">
            <el-input v-model="form.price"></el-input>&nbsp;
            <span>元</span>&nbsp;&nbsp;&nbsp;
            <span>满</span>
            <el-input :class="{actives:zzz}" v-model="form.limit" @focus="aaa" @blur="bbb"></el-input>&nbsp;
            <span>元可以使用</span>
          </el-form-item>
          <el-form-item label="优惠券类型：" label-width="120px" style="width: 100%;">
            <p>{{couponMsg.name}}</p>
            <el-button type="primary" @click="select_coupon_type" style="width:100px">点击选择</el-button>
          </el-form-item>
          <el-form-item label="可用时间：" label-width="120px">
            <el-radio v-model="form.radio" label="1">有时间限制</el-radio>
            <el-radio v-model="form.radio" label="3">无时间限制</el-radio>
            <el-radio v-model="form.radio" label="2">有效期</el-radio>
          </el-form-item>
          <el-form-item label-width="120px" v-if="form.radio == 1">
            <el-date-picker
              type="datetime"
              v-model="form.startTime"
              @change="verfy_startTime"
              placeholder="选择日期时间"
              style="width:200px"
              value-format="yyyy-MM-dd HH:mm:ss"
            ></el-date-picker>
            <span>------</span> &nbsp;
            <el-date-picker
              type="datetime"
              v-model="form.endTime"
              @change="verfy_endTime"
              placeholder="选择日期时间"
              style="width:200px"
              default-time="23:59:59"
              value-format="yyyy-MM-dd HH:mm:ss"
            ></el-date-picker>
          </el-form-item>
          <el-form-item style="margin-left: 120px;" label-width="120px" label="优惠券有效期" v-if="form.radio == 2">
           <el-input  v-model="form.intervals"></el-input>
           天
          </el-form-item>
        </el-form>
        <el-footer>
          <el-button type="primary" @click="add_coupon">确 定</el-button>
          <el-button style="color: #409eff" @click="$router.go(-1)">取 消</el-button>
        </el-footer>
      </el-main>
    </div>
  </div>
</template>


<script>
import breadcrumb from "../../components/breadcrumb";
import { coupon_add } from "../../api/getData.js";
export default {
  components: { breadcrumb },
  data() {
    return {
      activeName: ["1", "2", "3", "4", "5"],
      form: {
        name: "",
        price: "",
        limit: "",
        textarea: "",
        startTime: "",
        endTime: "",
        radio: "1",
        intervals:""
      },
      zhuangtai:"",
      zzz:false,
      couponMsg: { name: "", id: "" }
    };
  },
  created() {
    let msg = localStorage.getItem("msg") || "";
    let couponMsg = localStorage.getItem("couponMsg") || "";
    if (msg) {
      localStorage.removeItem("msg");
      this.form = JSON.parse(msg);
    }
    if (couponMsg) {
      localStorage.removeItem("couponMsg");
      this.couponMsg = JSON.parse(couponMsg);
    }
  },
  methods: {
    aaa(){
      this.zhuangtai=1
      this.zzz=false
    },
    bbb(){
      if(this.zhuangtai==1){
        if(Number(this.form.limit)>Number(this.form.price)){
        }else{
           this.$message({
                type: "warning",
                message: "需大于优惠券面额"
              });
          this.form.limit=""
        }
      }
      this.zhuangtai=""
    },
    add_coupon() {
      let limitKind = "";
      if(Number(this.form.limit)>Number(this.form.price)){
        if (this.form.radio == 2) {
          this.form.startTime = "";
          this.form.endTime = "";
          limitKind = 2;
          this.form.intervals=this.form.intervals*1
          if(!(/(^[1-9]\d*$)/.test(this.form.intervals))){
            return this.$message({
                    type: "warning",
                    message: "请输入正整数"
                  });
          }else{
            let data =
              "name=" +
              this.form.name +
              "&price=" +
              this.form.price +
              "&threshold=" +
              this.form.limit +
              "&source=" +
              "1" +
              "&startTime=" +
              this.form.startTime +
              "&endTime=" +
              this.form.endTime +
              "&note=" +
              this.form.textarea +
              "&typeId=" +
              this.couponMsg.id +
              "&limitKind=" +
              limitKind+
              "&intervals="+
              this.form.intervals;
            coupon_add(data).then(result => {
              if (result.data.status == 0) {
                if (result.data.data == 1) {
                  this.$router.push("/couponList");
                  return this.$message({
                    type: "success",
                    message: "添加成功"
                  });
                } else {
                  return this.$message({
                    type: "warning",
                    message: "添加失败"
                  });
                }
              }
            });
          }
        } else if(this.form.radio == 1){
          limitKind = 1;
          let data =
          "name=" +
          this.form.name +
          "&price=" +
          this.form.price +
          "&threshold=" +
          this.form.limit +
          "&source=" +
          "1" +
          "&startTime=" +
          this.form.startTime +
          "&endTime=" +
          this.form.endTime +
          "&note=" +
          this.form.textarea +
          "&typeId=" +
          this.couponMsg.id +
          "&limitKind=" +
          limitKind
        coupon_add(data).then(result => {
          if (result.data.status == 0) {
            if (result.data.data == 1) {
              this.$router.push("/couponList");
              return this.$message({
                type: "success",
                message: "添加成功"
              });
            } else {
              return this.$message({
                type: "warning",
                message: "添加失败"
              });
            }
          }
        });
        }else if(this.form.radio == 3){
          limitKind = 0;
          let data =
          "name=" +
          this.form.name +
          "&price=" +
          this.form.price +
          "&threshold=" +
          this.form.limit +
          "&source=" +
          "1" +
          "&startTime=" +
          this.form.startTime +
          "&endTime=" +
          this.form.endTime +
          "&note=" +
          this.form.textarea +
          "&typeId=" +
          this.couponMsg.id +
          "&limitKind=" +
          limitKind
        coupon_add(data).then(result => {
          if (result.data.status == 0) {
            if (result.data.data == 1) {
              this.$router.push("/couponList");
              this.zzz=true
              return this.$message({
                type: "success",
                message: "添加成功"
              });
            } else {
              return this.$message({
                type: "warning",
                message: "添加失败"
              });
            }
          }
        });
        }
      }else{
        this.zzz=true
        return this.$message({
                type: "warning",
                message: "需大于优惠券面额"
              });
      }
    },
    select_coupon_type() {
      localStorage.setItem("msg", JSON.stringify(this.form));
      localStorage.setItem("couponMsg", JSON.stringify(this.couponMsg));
      this.$router.push("/selectCouponType");
    },
    //   校验开始时间
    verfy_startTime() {
      if (this.form.startTime == null) {
        this.form.startTime = "";
      }

      if (this.form.endTime) {
        this.timeCompare(1);
      }
    },
    //   校验结束时间
    verfy_endTime() {
      if (this.form.endTime == null) {
        this.form.endTime = "";
      }

      if (!this.form.startTime) {
        this.form.endTime = "";
        return this.$message({
          type: "warning",
          message: "请先输入活动开始时间"
        });
      } else {
        this.timeCompare(2);
      }
    },
    //   结束时间与开始时间进行比较
    timeCompare(flag) {
      //  flag  用于标记是清楚开始时间，还是清楚结束时间
      if (
        new Date(this.form.startTime).getTime() >=
        new Date(this.form.endTime).getTime()
      ) {
        if (flag == 1) {
          this.form.startTime = "";
        } else {
          this.form.endTime = "";
        }
        return this.$message({
          type: "warning",
          message: "优惠券'可用开始时间'必须小于'可用结束时间'"
        });
      }
    }
  }
};
</script>



<style lang="less">
.addcoupon-container {
  @import "../../style/card.less";
  display: flex;
  flex-flow: column;
  height: 100%;
  // .price{

  // }
  .actives{
    border: solid 1px rgb(245,108,108)
  }
 .el-form{
   margin-top: 50px;
    .el-input {
    width: 200px;
    .el-input__inner {
      width: 200px !important;
    }
  }
 }
}
</style>
